<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/common.css" />
		<link rel="stylesheet" type="text/css" href="../css/artist-auth.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-back mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">帮办认证</h1>
		</header>
		<div class="mui-content">
			<p class="mui-text-center">填写你的身份证信息</p>
			<p class="mui-text-center">认证后可获得官方帮办认证身份</p>
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>真实姓名</label>
					<input type="text" class="mui-input-clear mui-input" id="rel_name" placeholder="姓名" />
				</div>
				<div class="mui-input-row">
					<label>身份证号</label>
					<input type="number" class="mui-input-clear mui-input" id="id_number" placeholder="18位身份证号" />
				</div>
			</form>
			<div class="photo" id="photo">
				<i class="iconfont">&#xe647;</i>
				<p>上传身份证照片(正面)</p>
			</div>
			<div class="photo" id="photo-inverse">
				<i class="iconfont">&#xe647;</i>
				<p>上传身份证照片(反面)</p>
			</div>
			<p class="mui-text-center">注：非身份证实名验证请联系客服</p>
			<p class="mui-text-center">身份证同时会作为实名信息进行验证</p>
			<button class="mui-btn btn-main btn-block">提交认证</button>
		</div>

		<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/user.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" charset="UTF-8">
			var nameElem = document.getElementById("rel_name");
			var pidElem = document.getElementById("id_number");
			var photoSrc, photoInverseSrc = null; // 身份证路径
			mui.plusReady(function() {
				// 选择照片
				mui('.mui-content').on('tap', '.photo', function() {
					var self = this;
					var btnArray = [{ title: "拍照" }, { title: "从相册选择" }];
					plus.nativeUI.actionSheet({
						title: "选择照片",
						cancel: "取消",
						buttons: btnArray
					}, function(e) {
						switch(e.index) {
							case 0:
								break;
							case 1:
								captureImage(self);
								break;
							case 2:
								selectPicture(self);
								break;
							default:
								break;
						}
					});
				})
				
				// 拍照
				function captureImage(self) {
					var cmr = plus.camera.getCamera();
					cmr.captureImage(function(path) {
							plus.gallery.save(path); //保存
							plus.io.resolveLocalFileSystemURL(path, function(entry) {
								var url = entry.toLocalURL();
								if(self.id == 'photo') {
									photoSrc = url;
								} else {
									photoInverseSrc = url;
								}
								self.innerHTML = "<img src=\'" + url + "\'/>";
								self.style.paddingTop = 0;
							});
						},
						function(error) {
							mui.toast("Capture image failed: " + error.message);
						}
					);
				}
				
				// 从相册中选择图片 
				function selectPicture(self) {
					plus.gallery.pick(function(path) {
						if(self.id == 'photo') {
							photoSrc = path;
						} else {
							photoInverseSrc = path;
						}
						self.innerHTML = "<img src=\'" + path + "\'/>";
						self.style.paddingTop = 0;
					}, function(err) {
						// TODO 判断用户主动取消还是打开失败
						mui.toast("Failed: " + err.message);
					});
				}
				
				// 提交认证
				mui('.mui-content').on('tap', 'button', function() {
					if(/^[\u4E00-\u9FA5]{2,5}(?:·[\u4E00-\u9FA5]{2,5})*$/.test(nameElem.value) && 
						/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/.test(pidElem.value)) {
							if(photoSrc && photoInverseSrc) {
								var url = baseURL + "realname/uploadFile/new.json";
								// 上传信息
								$("input").blur();
								var wt = plus.nativeUI.showWaiting("上传中");
								var task = plus.uploader.createUpload(url, { method: "POST" },
									function(t, status) { //上传完成
										if(status == 200) {
											wt.close();
											var parentPage = plus.webview.currentWebview().opener();
											mui.fire(parentPage, 'reload');
											mui.toast("上传成功");
											mui.back();
										} else {
											mui.toast("上传失败：" + status);
											wt.close();
										}
									}
								)
								task.addData("uid", "33");
								task.addData("myname", nameElem.value);
								task.addData("mynum", pidElem.value);
								task.addFile(decodeURI(photoSrc), { key: "up" });
								task.addFile(decodeURI(photoInverseSrc), { key: "down" });
								task.start();
							} else {
								mui.toast('请选择两张正确的照片');
							}
						} else {
							mui.toast('信息填写不符合规范');
						}
				})
			})
		</script>
	</body>

</html>